.home {
  width: 100%;
  color: #fff;
  position: relative;
  background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*HEGUT6CmGUwAAAAAAAAAAAAADu3UAQ/original");
  padding-bottom: 600px;
  position: relative;
  background-size: cover;
  background-color: #14182e;

  .logo {
    position: absolute;
    z-index: 1;
    left: 24px;
    top: 16px;
    width: 9%;
  }

  .home-header {
    height: 100vh;
    width: 100%;
    position: relative;
    .linear {
      width: 100%;
      height: 100px;
      position: absolute;
      bottom: 0;
      background-image: linear-gradient(
        0deg,
        rgba(3, 3, 16, 1) 0%,
        rgba(5, 6, 39, 0) 90%
      );
    }
    .header-img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      z-index: 0;
    }
    .open-source {
      position: absolute;
      left: 160px;
      top: 23%;
      z-index: 1;
      width: 661px;
      height: 448px;
      color: #fff;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      .title {
        width: 661px;
        height: 219px;
      }
      .tuGraph-icon {
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 32px;

        .tuGraph-img {
          width: 96px;
          height: 19px;
          margin-left: 8px;
          background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*xJFFRppyeZoAAAAAAAAAAAAADu3UAQ/original");
          background-size: 100% 100%;
          cursor: pointer;
        }
        .tuGraph-img:hover {
          background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*wFZwRpgk7lYAAAAAAAAAAAAADu3UAQ/original");
        }
        .line {
          width: 24px;
          height: 16px;
          margin-left: 24px;
          border-left: 1px solid #ccc;
        }
        .x-lab {
          width: 60px;
          height: 24px;
          background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*CNPhSYBeCFIAAAAAAAAAAAAADu3UAQ/original");
          background-size: 100% 100%;
          cursor: pointer;
        }
        .x-lab:hover {
          background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*rmlbS7hPvBMAAAAAAAAAAAAADu3UAQ/original");
        }
      }
      .text {
        width: 353px;
        height: 60px;
        position: absolute;
        top: 137px;
        right: -10px;
        font-size: 16px;
        color: #ffffff;
        line-height: 24px;
        .white-strip {
          width: 46px;
          height: 4px;
          background: #ffffff;
          border-radius: 0.5px;
          margin-top: 8px;
        }
      }
    }
  }
  .tuGraph-project {
    width: 100%;
    height: 600px;
    margin-top: 80px;
    display: flex;
    justify-content: center;
    .project-body {
      height: 100%;
      display: flex;
      align-items: center;
      flex-direction: row;
      .title-left,
      .title-right {
        width: 400px;
        height: 120px;
        .project-info {
          display: flex;
          flex-direction: row;
          align-items: center;
          height: 48px;
          .info-video {
            height: 48px;
            width: 48px;
          }
          .info-title {
            font-size: 40px;
            color: #e6ecff;
            line-height: 48px;
            font-weight: 500;
            margin-left: 16px;
          }
        }
        .project-parse {
          font-size: 16px;
          color: #ffffff;
          line-height: 24px;
          opacity: 0.65;
          margin-top: 24px;
        }
      }
      .tuGraphImg-right {
        width: 600px;
        margin-left: 71px;
      }
      .tuGraphImg-left {
        width: 600px;
      }
    }
  }

  .home-bottom {
    width: 100%;
    position: absolute;
    bottom: 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    .gov {
      font-size: 12px;
      padding: 10px 0;
      color: #8b90b0;
      &-text {
        cursor: pointer;
        &:hover {
          color: #3a63f2;
        }
      }
    }
    .os-graph {
      width: 100%;
    }
    .bottom-img {
      width: 506px;
      height: 42px;
      display: flex;
      position: absolute;
      bottom: 96px;
      justify-content: space-between;
      align-items: center;
      .tuGraph-url {
        width: 120px;
        height: 20px;
        background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*OduJTbKJaG0AAAAAAAAAAAAADu3UAQ/original");
        background-size: 100% 100%;
      }

      .gitHub-url {
        width: 40px;
        height: 40px;
        background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*gNApS7tzP5YAAAAAAAAAAAAADu3UAQ/original");
        background-size: 100% 100%;
      }

      .antv-url {
        width: 40px;
        height: 40px;
        background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*zFuMTonNZkkAAAAAAAAAAAAADu3UAQ/original");

        background-size: 100% 100%;
      }
    }
    .bottom-link {
      display: flex;
      flex-direction: row;
      align-items: center;
      cursor: pointer;
      font-size: 18px;
      color: #ffffff;
      font-weight: 500;
    }
    .bottom-link:hover {
      color: #3a63f2;
      .gitHub-url {
        background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*I9I1S4lWlzwAAAAAAAAAAAAADu3UAQ/original");
      }
      .antv-url {
        background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*UARqT77tlJUAAAAAAAAAAAAADu3UAQ/original");
      }
      .tuGraph-url {
        background-image: url("https://mdn.alipayobjects.com/huamei_0bwegv/afts/img/A*w-qITIZMNEgAAAAAAAAAAAAADu3UAQ/original");
      }
    }
  }
}
